/* 全局页面滚动条 */
body,
html {
  overflow: hidden;
  height: 100%;
}

/* 侧边栏样式 */
.layout-aside {
  transition: width 0.3s;
  background-color: rgb(33, 49, 78);

  /* 平台标题样式 */
  .aside-title {
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    margin-bottom: 20px;
    color: #ffffff;
    padding: 20px 0;
    height: 0px;

    &.is-collapsed {
      font-size: 0;
      margin-bottom: 0;
    }
  }

  /** 菜单列表样式 */
  .menu-list {
    background-color: rgb(33, 49, 78);
    transition: all 0.3s;
    font-size: 17px;

    .el-menu-item {
      display: flex;
      align-items: center;
      height: 50px;
      padding: 0 20px;
      transition: all 0.3s;
      color: #bfcbd9;
      font-weight: 500;

      i {
        font-size: 20px;
        margin-right: 10px;
        transition: color 0.3s;
        color: #bfcbd9;
      }

      // 悬浮样式
      &.is-active {
        background-color: #2c3a55;
        color: #ffffff;

        i {
          color: #ffffff;
        }
      }

      // 激活状态样式
      &.hover {
        background-color: #1e283d;
        color: #409eff;
        font-weight: bold;
        border-right: 4px solid #409eff;

        i {
          color: #409eff;
        }
      }
    }
  }
}

/* 顶部导航样式 */
.layout-header {
  background-color: white;
  color: #f8f7f7;
  padding: 10px 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid #e4e4e4;

  /* 顶部左侧部分 */
  .header-left {
    display: flex;
    align-items: center;
    gap: 10px;

    /* 折叠按钮 */
    .header-collapse-btn {
      margin-right: 10px;
      border: none;
      font-size: 24px;
      padding: 5px;
      background-color: transparent;
    }
  }

  /* 顶部右侧功能菜单 */
  .header-actions {
    display: flex;
    align-items: center;
    gap: 15px;

    .header-settings-icon {
      font-size: 20px;
      cursor: pointer;
    }
  }
}

/* 内容区样式 */
.layout-content {
  background-color: #ffffff;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  border-radius: 8px;
  padding: 20px;
  margin: 20px;
  height: calc(100vh - 40px);
}
